.circle {
  width: 120%;
  height: 280px;
  background: #4e96f5;
  border-radius: 0 0 50% 50%;
  margin-left: -10%;
}

.grocery-area {
  position: relative;
  font-family: PingFangSC-Medium;
  font-size: 32px;
  color: #ffffff;
  letter-spacing: 0;
  margin: 0 23px 19px;
}
.cube {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
  align-items: center;
  justify-content: center;
  width: 154px;
  height: 136px;
  background: #fafafa;
  border: 1px solid #eeeeee;
  border-radius: 4px;
  flex-shrink: 0;
}

.tab {
  font-family: PingFangSC-Medium;
  font-size: 30px;
  color: #333;
  letter-spacing: 0;
  text-align: center;
  width: 84px;
  padding: 14px 0;
  border-bottom: 6px solid transparent;
}
.tab-active {
  border-bottom: 6px solid #4e96f5;
  color: #4e96f5;
}

.title {
  font-family: PingFangSC-Medium;
  font-size: 34px;
  color: #ffffff;
  letter-spacing: 0;
  text-align: center;
  position: relative;
  height: 111px;
  line-height: 111px;
  background-color: transparent;
}
